<template>
	<view style="padding: 10rpx;" class="a">
		<button type="primary" style="margin-bottom: 10rpx;" @click="add()">新增</button>
		<!-- 		<scroll-view scroll-y="true" >
			<transition-group name="flip-list" tag="uni-view">
					<block v-for="item in List" :key="item.id">
					  <view class="">{{ item.name }}</view>
					</block>
			</transition-group>
		</scroll-view>
		<button type="primary" style="margin-bottom: 10rpx;" @click="shuffle()">打乱</button> -->
		<uni-table stripe border>
			<uni-tr>
				<uni-th align="center">ID</uni-th>
				<uni-th align="center">HOST</uni-th>
			</uni-tr>
			<uni-tr v-for="item,index in List" :keys="index">
				<uni-td align="center">{{item.id}}</uni-td>
				<uni-td align="left">
					<view @click="jump(item.id)">
						{{item.host?item.host:'没填'}}({{item.name}})
					</view>
				</uni-td>
			</uni-tr>
		</uni-table>
	</view>
</template>

<script>
	import {
		getWebsiteList,
		addWebsite
	} from '../../api/index.js'
	import request from '../../utils/request.js'
	export default {
		data() {
			return {
				List: []
			}
		},
		onShow() {
			this.getWebsiteList()
		},
		onLoad() {

		},
		methods: {
			shuffle() {
				var randomNumber = function() {
					return 0.5 - Math.random()
				}
				this.List.sort(randomNumber)
			},
			add() {
				addWebsite({}).then(res => {
					this.jump(res.id)
				})
			},
			jump(id) {
				uni.navigateTo({
					url: './test?id=' + id
				})
			},
			getWebsiteList() {
				getWebsiteList().then(res => {
					this.List = res
				})
			}
		}
	}
</script>

<style>
	.flip-list-move {
		transition: transform 1s;
	}
</style>
